<template>
    <div style="margin:20px;padding:20px;background-color:#fff;">
        <el-button type="primary" size="small" @click="goAdd" style="margin-bottom:10px;">添加代理</el-button>
        <el-form :inline="true" class="demo-form-inline" size="small">
            <el-form-item label="归属公司">
                <el-input v-model="s_company_name" placeholder="请输入" clearable></el-input>
            </el-form-item>
            <el-form-item label="代理姓名">
                <el-input v-model="s_user_name" placeholder="请输入" clearable></el-input>
            </el-form-item>
            <el-form-item label="手机号">
                <el-input v-model="s_phone" maxlength="11" placeholder="请输入" clearable></el-input>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" @click="onSubmit">查询</el-button>
            </el-form-item>
        </el-form>
        <el-table :data="tableInfo" size="small">
            <el-table-column prop="index" label="序号"></el-table-column>
            <el-table-column prop="company" label="归属公司"></el-table-column>
            <el-table-column prop="customer" label="代理姓名"></el-table-column>
            <el-table-column prop="phone" label="手机号"></el-table-column>
            <el-table-column prop="address" label="详细地址"></el-table-column>
            <el-table-column prop="remark" label="备注"></el-table-column>
            <el-table-column label="操作">
                <template slot-scope="scope">
                    <el-button type="text" @click="goWrite" size="small">修改</el-button>
                    <el-button type="text" @click="goDelete" size="small">删除</el-button>
                </template>
            </el-table-column>
        </el-table>
        <div class="pagination-box">
            <el-pagination @current-change="changePageSkip" :current-page="currentPage" :total="total" layout="prev, pager, next" background></el-pagination>
        </div>
    </div>
    
</template>

<script>
    export default {
        data() {
            return {
                s_company_name:'',
                s_user_name:'',
                s_phone:'',
                tableInfo:[],
                currentPage:1,
                total:1,
            }
        },
        mounted(){
            this.getData('reset')
        },
        methods: {
            getData(type){
                let skip = 0
                if(type != 'reset'){
                    skip = this.currentPage
                }else{
                    this.currentPage = 1
                }
                this.$axios({
                    url: this.$url.getProxyList,
                    method:'get',
                    data:{
                        name:this.s_company_name,
                        username:this.s_user_name,
                        phone:this.s_phone,
                        page:skip,
                        limit:10,
                    }
                }).then(response=>{
                    if(response.data.result.success){
                        let index = 0
                        let option = []
                        for(let value of response.data.content.data){
                            index++
                            let nowIndex = index+(10*skip)
                            option.push({
                                index:nowIndex,
                                company:value.name,
                                username:value.username,
                                phone:value.phone,
                                id:value.id
                            })
                        }
                        this.total = response.data.content.total;
                        this.currentPage = response.data.content.current_page;
                        this.tableInfo = option
                    }else{
                        this.$notify.error({
                            title: '错误',
                            message: response.data.result.errorMsg
                        });
                    }
                }).catch(error=>{
                    console.log(error);
                })
            },
            onSubmit() {
                console.log('submit!');
            },
            goAdd(){
                this.$router.push("/proxy/add")
            },
            goWrite(){
                this.$router.push("/proxy/edit")
            },
            goDelete(){

            },
            changePageSkip(){

            },
        },
    }
</script>

<style scoped>

</style>